<template>
	<view>
		<view class="add-c">
			<view class="row">
				<view class="name">
					收件人
				</view>
				<view class="ipts">
					<input type="text" value="" placeholder="请输入收件人姓名" v-model="obj.name" />
				</view>
			</view>
			<view class="row">
				<view class="name">
					电话号码
				</view>
				<view class="ipts">
					<input type="text" value="" placeholder="请输入收件人电话号码" v-model="obj.phoneNumber" />
				</view>
			</view>
			<view class="row">
				<view class="name">
					所在地区
				</view>
				<view class="ipts">
					<pick-regions :defaultRegion="defaultRegionCode" @getRegion="handleGetRegion">

						<view v-if="flag">{{obj.province}}-{{obj.city}}-{{obj.region}}</view>
						<view v-else>{{obj.province}}-{{obj.city}}-{{obj.region}}</view>
					</pick-regions>
				</view>
			</view>
			<view class="row">
				<view class="name">
					详细地址
				</view>
				<view class="ipts">
					<input type="text" value="" placeholder="请输入详细地址" v-model="obj.detailAddress" />
				</view>
			</view>
			<view class="row">
				<view class="name">
					设置默认地址
				</view>
				<view class="ipts">
					<view class="radios">
						<evan-switch v-model="checked" active-color=" #354e44" @change="onChagne"></evan-switch>
					</view>
				</view>
			</view>
			<!-- 保存地址 -->
			<view class="row">
				<view class="del-btn" @tap="del">
					删除收货地址
				</view>
			</view>
			<view class="add" @tap="save">
				保存地址

			</view>
		</view>

	</view>
	</view>
</template>

<script>
	import {
		updataAdd,
		change,
		delAddress
	} from "../../../utils/address/index.js"
	const app = getApp();
	export default {
		data() {
			return {
				obj: {},
				flag: true,
				defaultRegion: [],
				defaultRegionCode: '',
				checked: false
			};
		},
		onShow() {
			var items = app.globalData.items
			console.log(items)
			this.obj = items
			this.defaultRegion = [this.obj.province, this.obj.city, this.obj.region]
			this.defaultRegionCode = this.obj.cityCode.slice(-6)
			if (this.obj.defaultStatus == 1) {
				this.checked = true
			}
			console.log(this.defaultRegion, this.defaultRegionCode)
		},
		methods: {
			handleGetRegion(res) {


				this.flag = false
				var cityList = res.map(el => el.name)
				console.log(cityList)
				this.obj.province = cityList[0],
					this.obj.city = cityList[1],
					this.obj.region = cityList[2]
				console.log("改变后的", this.obj)
			},
			onChagne(e) {
				if (e == true) {
					this.obj.defaultStatus = 1
				} else {
					this.obj.defaultStatus = 0
				}
				change(this.obj.id, this.obj.defaultStatus).then(res => {
					if (res.success) {
						uni.showToast({
							title: "修改成功"
						})
					}
				})
			},
			save() {
				updataAdd(this.obj).then(res => {
					if (res.success) {
						uni.showToast({
							title: "修改成功"
						})
					}

					setTimeout(() => {
						uni.navigateBack({

						})
					}, 1000)
				})
			},
			del(){
				delAddress(this.obj.id).then(res=>{
					if (res.success) {
						uni.showToast({
							title: "删除成功"
						})
					}
					
					setTimeout(() => {
						uni.navigateBack({
					
						})
					}, 1000)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.add-c {
		width: 90%;
		margin: 0 auto;

		.add {
			position: fixed;
			bottom: 80rpx;
			width: 70%;
			margin: 0 auto;
			height: 80rpx;
			background-color: #354e44;
			border-radius: 80rpx;
			left: 50%;
			margin-left: -35%;
			color: #fff;
			line-height: 80rpx;
			text-align: center;
		}

		.row {
			display: flex;
			justify-content: space-between;
			align-items: center;
			border-bottom: 2rPx solid #ccc;

			.del-btn {
				width: 100%;
				height: 100rpx;
				justify-content: center;
				margin-top: 60rpx;
				align-items: center;
				font-size: 36rpx;
				color: #fff;
				background-color: #e64340;
				border-bottom: solid 1rpx #eee;
				text-align: center;
				line-height: 100rpx;
				border-radius: 10rpx;
			}

			.name {
				width: 30%;
				height: 120rpx;
				font-weight: 200;
				font-size: 30rpx;
				line-height: 120rpx;
				text-align: left;
			}

			.ipts {
				width: 70%;
				// display: flex;
				// justify-content: center;
				// align-items: center;
				font-size: 30rpx;

				.radios {
					float: right;
				}
			}
		}
	}
</style>
